<template>
  <div class="iframe-container">
    <iframe
        src="http://192.168.20.7:40080/ui/chat/a5e5e97a999a6b69"
        frameborder="0"
        allow="microphone"
        class="scaled-iframe"
    ></iframe>
  </div>
</template>

<script setup lang="ts">
// 这里可以放置任何需要的 TypeScript 逻辑
</script>

<style scoped>
.iframe-container {
  width: 100%;
  height: 100vh; /* 使用视口单位确保整个视窗高度 */
  overflow: hidden; /* 防止缩放后的内容溢出 */
  position: relative;
}

.scaled-iframe {
  width: 100%;
  height: 100%;
  transform-origin: top left; /* 设置缩放的原点 */
  transition: transform 0.3s ease-in-out; /* 添加平滑过渡效果 */
}

/* 默认情况下不缩放 */
.scaled-iframe {
  transform: scale(1);
}


</style>